<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 传统方式 location.search
        function query(name) {
            // 类似数组的slice
            const search = location.search.substr(1);
            // /^abc$/ 和 new RegExp('^abc$') 一样
            // (^|&)表示：要不以开始开始，要不以&开始
            // [^&]表示不要&开始
            // i表示大小写不区分
            // (&|$)表示：要不以&结尾，要不以$结尾
            const reg = new RegExp(`(^|&)${name}=([^&]*)(&|$)`, 'i');
            const res = search.match(reg);
            if (res === null) {
                return null;
            }
            console.log(res);
            return res[2];
            // 这里返回下标为2的元素因为正则表达式匹配了多个元素
            // 0: "&b=20&" 1: "&" 2: "20" 3: "&"
            // 每次匹配只需要下标为2的元素
        }
        query('b');
        // 也可以使用拆分字符串然后存储到数组内

        // URLSearchParams
        // 有兼容性问题
        function query(name) {
            // 不用去除问号
            const search = location.search;
            const p = new URLSearchParams(search);
            return p.get(name);
        }
        console.log(query('a'));
    </script>
</body>

</html>